<template>
  <div class="trendApp" id="trendApp" v-cloak>
    <iframe :src="frame_url" frameborder="0" class="vFrame" id="iframe"></iframe>
  </div>
</template>
<script>
const _dataTrend = window._dataTrend
export default {
  data() {
    return {
      frame_url: ""
    }
  },
  methods: {

  },
  created() {
    let url_type = this.$route.query.type;
    let url_id = this.$route.query.id;
    this.frame_url = _dataTrend[url_type].url;
    if (url_id) {
      this.frame_url = _dataTrend[url_type].data[url_id].url;
    }
    url_type = url_type - 0 + 1;
    bus.$emit('changeHeaderLogo', "logo_trend_" + url_type)
  },
  mounted() {
    let h = util.viewData().viewHeight;
    $('#trendApp').css({ 'height': (h - 44) + 'px' });
    $('#iframe').css({ 'height': (h - 44) + 'px' });
  }
}
</script>
<style lang="stylus">
@import "../../assets/mixin.styl"
.trendApp{
  width 100%
  height 100%
}
.vFrame{
  width 100%
  height 100%
}
.header
  .logo_trend_1{
      background-image:url("./i/2@3x.png")
      width 117px
      height 26px
  }
  .logo_trend_2{
      background-image:url("./i/3@3x.png")
      width 117px
      height 26px
  }
  .logo_trend_3{
      background-image:url("./i/4@3x.png")
      width 164px
      height 26px
  }
  .logo_trend_4{
      background-image:url("./i/5@3x.png")
      width 106px
      height 26px
  }
  .logo_trend_5{
      background-image:url("./i/6@3x.png")
      width 106px
      height 26px
  }
</style>


